<!DOCTYPE html>
<html>
<head>
<style type="text/css">
div{
width:100px;
height:100px;
background:red;
position:relative;
animation:mymove 30s infinite;
}
@keyframes mymove
{
0%   {top:0px; left:0px;  background:red;}
25%  {top:0px; left:100px; background:blue;}
50%  {top:100px; left:100px; background:yellow;}
75%  {top:100px; left:0px; background:green;}
100% {top:0px; left:0px; background:red;}
}
</style>
</head>
<body>
	<div id="">
		
	</div>

</body>
</html>
